var indexMonitor = {
    map: null,//地图
    cityId: null,//城市id
    popup: null,//悬浮窗图层
    cityVector: null,//城市图层
    citySource: null,//城市source
    districtVector: null,//行政区图层
    districtSource: null,//行政区source
    cityVectorData: null,//城市数据
    sectionVector: null,//板块图层
    sectionData: new Array(),//版块缓存
    sectionSource: null,
    name: null,
    rName: null,
    zoom: null,//地图当前层级
    lastData: null,//记录上次数据
    rqVector: null, // 楼盘图层
    countMap: null,
    lastValue: null,//保存上一级的类型编号
    length: null, //鼠标选择的feature
    coordinate: null, //鼠标坐标
    lastFeatureId: null,//记录上次featur的id
    ifCommunity: null,//是否是楼盘显示
    attributName: null,//属性名称
    mBox: null,//mBox图层
    arrLayers: new Array(),//图层数组
    serverUrl: 'https://oms.cindata.cn/geoserver/eps/ows?',//linux+
    serverUrlWms: 'https://oms.cindata.cn',
    init: function () {
        var self = this;
        $('#map').on('click', function (e) {
            $('#map').hide();
            indexMonitor.mBox = 'mBox';
            indexMonitor.map.getView().setZoom(9);
            indexMonitor.switchDistrictSource(1, '4401');
            // self.cener =[e.clientX+document.body.scrollLeft+document.documentElement.scrollLeft, e.clientY+document.body.scrollTop+document.documentElement.scrollTop]
            // var top = new Array()
            // self.map.forEachFeatureAtPixel(self.cener, function (feature, layer) {
            //     top.push(feature)
            // });
            // debugger
        })
        if ("https:" == document.location.protocol) {
            this.serverUrl = 'https://oms.cindata.cn/geoserver/eps/ows?';
        } else {
            this.serverUrl = 'http://omap.cindata.cn/geoserver/eps/ows?';
        }
        this.cityId = '440100';
        this.map = xdmap.mapInit('allmap', 7, [12615328.043, 2648203.7431]);
        this.map.getView().setMinZoom(6);
        this.map.getView().setMaxZoom(16);
        this.map.on('singleclick', function (e) {
            indexMonitor.onSingleClick(e);
        });
        this.map.on('pointermove', function (e) {
            indexMonitor.onMouseMove(e);
        });
        this.map.getView().on('change:resolution', function (e) {
            $('#map').hide()
            indexMonitor.onResChange(e)
        });
        this.layetInit();
        $('#footNav ul li').on('click', function (e) {
            var li = $(this);
            var text = li.attr('value');
            indexMonitor.switchCitySource(parseInt(text))
        })
        // indexMonitor.switchCitySource(1)
    },
    //给js前端方法
    invoking: function () {
        var center = [12615328.043, 2648203.7431];
        indexMonitor.coordinate = center;
        indexMonitor.map.getView().setCenter(center);
        indexMonitor.map.getView().setZoom(9);
        indexMonitor.cityVector.setVisible(false);
        indexMonitor.districtVector.setVisible(true);
        var value = indexMonitor.lastValue == null ? 1 : indexMonitor.lastValue;
        indexMonitor.switchDistrictSource(value, '440100');
        $('#leftTable').animate({left: '20px'});
    },
    //图层初始化
    layetInit: function () {
        var self = indexMonitor;
        self.creatrPopup();
        self.source = new ol.source.Vector({
            format: new ol.format.GeoJSON({
                defaultDataProjection: 'EPSG:4326',
                featureProjection: 'EPSG:3857'
            }),
            wrapX: false
        });
        self.cityVector = new ol.layer.Vector({
            source: indexMonitor.source,
            zIndex: 1001
        });
        self.cityVector.set('id', 'city');
        self.districtSource = new ol.source.Vector({
            format: new ol.format.GeoJSON({
                defaultDataProjection: 'EPSG:4326',
                featureProjection: 'EPSG:3857'
            }),
            wrapX: false
        });
        self.districtVector = new ol.layer.Vector({
            source: indexMonitor.districtSource,
            zIndex: 1001
        });
        self.sectionSource = new ol.source.Vector({
            format: new ol.format.GeoJSON({
                defaultDataProjection: 'EPSG:4326',
                featureProjection: 'EPSG:3857'
            }),
            wrapX: false
        });
        self.sectionVector = new ol.layer.Vector({
            source: indexMonitor.sectionSource,
            zIndex: 1001
        });
        // this.sectionSource = this.getSectionSource();
        self.districtVector.set('id', 'district');
        self.sectionVector.set('id', 'section');
        self.arrLayers.push(self.cityVector);
        self.arrLayers.push(self.districtVector);
        self.arrLayers.push(self.sectionVector);
        self.map.addLayer(self.cityVector);
        self.map.addLayer(self.districtVector);
        self.map.addLayer(self.sectionVector);
        //this.switchCitySource(1);
    },
    //创建悬浮窗
    creatrPopup: function () {
        var div = $('<div id="rqInfo" style="cursor: pointer;">' +
            '<p id="rqSj" style="border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 15px solid rgb(255, 152, 0); position: absolute; left: 50%; bottom: -14px; transform: translateX(-50%);"></p>' +
            '<div id="rqName" style="border: 1px solid rgb(255, 152, 0); color: rgb(51, 51, 51); padding: 6px 11px; border-radius: 4px; background: rgb(255, 255, 255); position: absolute; top: -43px; left: 50%; max-width: 500px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; z-index: 10; transform: translateX(-50%); cursor: pointer;">info</div>' +
            '</div>')
        indexMonitor.popup = new ol.Overlay({
            element: div[0],
            insertFirst: false,
            stopEvent: false
        });
        indexMonitor.map.addOverlay(indexMonitor.popup);
    },
    //城市级别
    getCitySource: function (i, plus, a) {
        var cityId = indexMonitor.cityId;
        var cityCode = '';
        try {
            cityCode = indexMonitor.cityId.substring(0, 4)
        } catch (e) {
            cityCode = indexMonitor.cityId.toString().substring(0, 4);
        }
        var url = '../../assets/newMap/data/mapdata/city/' + 44 + '.json';
        var source = new ol.source.Vector({
            format: new ol.format.GeoJSON({
                featureProjection: 'EPSG:3857'
            }),
            loader: function (extent, resolution, projection) {
                $.getJSON(url, function (value) {
                    var features = source.getFormat().readFeatures(value);
                    $.getJSON(url, function (info) {
                        var countryPopVals = new Array();
                        var data = source.getFormat().readFeatures(info);
                        var j = -1;
                        data.forEach(function (item) {
                            if(indexMonitor.attributName == '房价浮动'){
                                var number = item.N.id%2;
                                if(number != 0){
                                    j = j - plus;
                                    i = j;
                                }else {
                                    i = i + plus;
                                }
                            }else{
                                i = i + plus;
                            }
                            var sale_count = i;
                            countryPopVals.push(sale_count);
                            features.forEach(function (bv) {
                                if (item.N.id == bv.N.id) {
                                    bv.set('count', sale_count);
                                }
                            })
                        })
                        var serie = new geostats(countryPopVals);
                        serie.getClassEqInterval(6);
                        var colors_x = ['#1F9E54', '#68BF27', '#AEDB15', '#E0AF24', '#DE6021', '#E1230D'];
                        // var colors_x = ['#00FF00', '#4B0082', '#FFD700', '#FF0000'];
                        serie.setColors(colors_x);
                        var style = indexMonitor.getGradRenderStyle(serie, colors_x);
                        indexMonitor.cityVector.setStyle(style)
                        document.getElementById('gisShow').innerHTML = serie.getHtmlLegend(colors_x, indexMonitor.attributName + '(' + indexMonitor.unit + ')', null,'','','',indexMonitor.attributName );
                        // document.getElementById('legend1').innerHTML = serie.getHtmlLegend(colors_x, '成交量 (套)', 1);
                        source.addFeatures(features);
                        // indexMonitor.cityVector.setSource(source);
                    })
                })
            }
        });
        return source;
    },
    //城市数据切换
    switchCitySource: function (value) {
        indexMonitor.lastValue = value;
        $('#map').hide()
        switch (value) {
            case 1: {
                this.attributName = '押品数量';
                this.unit = '套';
                indexMonitor.source = this.getCitySource(4351, 326);
            }
                break;
            case 2: {
                this.attributName = '动态抵押率';
                this.unit = '%';
                indexMonitor.source = this.getCitySource(1, 1);
            }
                break;
            case 3: {
                this.attributName = '住宅均价';
                this.unit = '元/平方米';
                indexMonitor.source = this.getCitySource(23560, 30);
            }
                break;
            case 4: {
                this.attributName = '非住宅均价';
                this.unit = '元/平方米';
                indexMonitor.source = this.getCitySource(33560, 30);
            }
                break;
            case 5: {
                this.attributName = '债偿收入比';
                this.unit = '%';
                indexMonitor.source = this.getCitySource(1.5, 1);
            }
                break;
            case 6: {
                this.attributName = '经营性物业占比';
                this.unit = '%';
                indexMonitor.source = this.getCitySource(8, 1);
            }
                break;
            case 7: {
                this.attributName = '新楼盘指标分析';
                this.unit = '%';
                indexMonitor.source = this.getCitySource(16, 1);
            }
                break;
            case 8: {
                this.attributName = '楼盘';
                this.unit = '套';
                indexMonitor.source = this.getCitySource(5800, 23);
            }
                break;
            case 9: {
                this.attributName = '住宅数量和比例';
                this.unit = '套';
                indexMonitor.source = this.getCitySource(4326, 23);
            }
                break;
            case 10: {
                this.attributName = '住宅利率';
                this.unit = '%';
                indexMonitor.source = this.getCitySource(1.2, 1);
            }
                break;
            case 11: {
                this.attributName = '住宅面积';
                this.unit = '平方米';
                indexMonitor.source = this.getCitySource(98, 2);
            }
                break;
            case 12: {
                this.attributName = '住宅区域';
                this.unit = '';
                indexMonitor.source = this.getCitySource(98, 2);
            }
                break;
            case 13: {
                this.attributName = '房价浮动';
                this.unit = '%';
                indexMonitor.source = this.getCitySource(2, 1);
            }
                break;
            case 14: {
                this.attributName = '建筑面积供应量';
                this.unit = '';
                indexMonitor.source = this.getCitySource(98, 2);
            }
                break;
            case 15: {
                this.attributName = '逾期分布';
                this.unit = '套';
                indexMonitor.source = this.getCitySource(358, 1);
            }
                break;
            case 16: {
                this.attributName = '存量楼盘数据分析完整性';
                this.unit = '%';
                indexMonitor.source = this.getCitySource(1.5, 1);
            }
                break;
            case 17: {
                this.attributName = '住宅价格指标数据分析完整性';
                this.unit = '元/平方米';
                indexMonitor.source = this.getCitySource(23560, 30);
            }
                break;
            case 18: {
                this.attributName = '非住宅用房指标数据分析完整性';
                this.unit = '元/平方米';
                indexMonitor.source = this.getCitySource(23576, 30);
            }
                break;
            case 19: {
                this.attributName = '房价浮动';
                this.unit = '%';
                indexMonitor.source = this.getCitySource(1, 1);
            }
                break;
            case 20: {
                this.attributName = '建筑面积供应量';
                this.unit = '万平方米';
                indexMonitor.source = this.getCitySource(2354, 30);
            }
                break;
        }
        this.cityVector.setSource(indexMonitor.source);
    },
    //行政区级别
    getDistrictSource: function (i, plus, districtId) {
        var id = parseInt(districtId);
        var url = '../../assets/newMap/data/mapdata/county/' + id + '.json';
        var source = new ol.source.Vector({
            format: new ol.format.GeoJSON({
                featureProjection: 'EPSG:3857'
            }),
            loader: function (extent, resolution, projection) {
                $.getJSON(url, function (value) {
                    var features = source.getFormat().readFeatures(value);
                    $.getJSON(url, function (info) {
                        var countryPopVals = new Array();
                        var data = source.getFormat().readFeatures(info);
                        var j = -1;
                        data.forEach(function (item) {
                            if(indexMonitor.attributName == '房价浮动'){
                                var number = item.N.id%2;
                                if(number != 0){
                                    j = j - plus;
                                    i = j;
                                }else {
                                    i = i + plus;
                                }
                            }else{
                                i = i + plus;
                            }
                            var sale_count = i;
                            countryPopVals.push(sale_count);
                            features.forEach(function (bv) {
                                if (item.N.id == bv.N.id) {
                                    bv.set('count', sale_count);
                                }
                            })
                        })
                        var serie = new geostats(countryPopVals);
                        serie.getClassEqInterval(6);
                        // var colors_x = ['#E1230D', '#DE6021', '#E0AF24', '#AEDB15', '#68BF27', '#1F9E54'];
                        var colors_x = ['#1F9E54', '#68BF27', '#AEDB15', '#E0AF24', '#DE6021', '#E1230D'];
                        serie.setColors(colors_x);
                        var style = indexMonitor.getGradRenderStyle(serie, colors_x);
                        indexMonitor.districtVector.setStyle(style)
                        document.getElementById('gisShow_1').innerHTML = serie.getHtmlLegend(colors_x, indexMonitor.attributName + '(' + indexMonitor.unit + ')', null,'','','',indexMonitor.attributName);
                        source.addFeatures(features);
                    })
                })
            }
        });
        return source;
    },
    //行政区数据切换
    switchDistrictSource: function (value, id) {
        indexMonitor.lastValue = value;
        var districtId = ''
        if (id.length == 6) {
            districtId = id;
        } else {
            districtId = id + '00';
        }
        var self = indexMonitor;
        self.cityId = districtId;
        self.ifCommunity = false;
        switch (value) {
            case 1: {
                this.attributName = '押品数量';
                this.unit = '套';
                indexMonitor.districtSource = this.getDistrictSource(324, 32, districtId);
            }
                break;
            case 2: {
                this.attributName = '动态抵押率';
                this.unit = '%';
                indexMonitor.districtSource = this.getDistrictSource(2, 1, districtId);
            }
                break;
            case 3: {
                this.attributName = '住宅均价';
                this.unit = '元/平方米';
                indexMonitor.districtSource = this.getDistrictSource(23698, 32, districtId);
            }
                break;
            case 4: {
                this.attributName = '非住宅均价';
                this.unit = '元/平方米';
                indexMonitor.districtSource = this.getDistrictSource(324, 32, districtId);
            }
                break;
            case 5: {
                this.attributName = '债偿收入比';
                this.unit = '%';
                indexMonitor.districtSource = this.getDistrictSource(1, 1, districtId);
            }
                break;
            case 6: {
                this.attributName = '经营性物业占比';
                this.unit = '%';
                indexMonitor.districtSource = this.getDistrictSource(1, 1, districtId);
            }
                break;
            case 7: {
                this.attributName = '新楼盘指标分析';
                this.unit = '%';
                indexMonitor.districtSource = this.getDistrictSource(1, 1, districtId);
            }
                break;
            case 8: {
                this.attributName = '楼盘';
                this.unit = '套';
                indexMonitor.districtSource = this.getDistrictSource(5800, 29, districtId);
            }
                break;
            case 9: {
                this.attributName = '住宅数量和比例';
                this.unit = '';
                indexMonitor.districtSource = this.getDistrictSource(26585, 19, districtId);
            }
                break;
            case 10: {
                this.attributName = '住宅利率';
                this.unit = '%';
                indexMonitor.districtSource = this.getDistrictSource(2, 1, districtId);
            }
                break;
            case 11: {
                this.attributName = '住宅面积';
                this.unit = '平方米';
                indexMonitor.districtSource = this.getDistrictSource(98, 1, districtId);
            }
                break;
            case 12: {
                this.attributName = '住宅区域';
                this.unit = '';
                indexMonitor.districtSource = this.getDistrictSource(92, 1, districtId);
            }
                break;
            case 13: {
                this.attributName = '房价浮动';
                this.unit = '%';
                indexMonitor.districtSource = this.getDistrictSource(3, 1, districtId);
            }
                break;
            case 14: {
                this.attributName = '建筑面积供应量';
                this.unit = '';
                indexMonitor.districtSource = this.getDistrictSource(95, 1, districtId);
            }
                break;
            case 15: {
                this.attributName = '逾期分布';
                this.unit = '套';
                indexMonitor.districtSource = this.getDistrictSource(324, 2, districtId);
            }
                break;
            case 16: {
                this.attributName = '存量楼盘数据分析完整性';
                this.unit = '%';
                indexMonitor.districtSource = this.getDistrictSource(1, 1, districtId);
            }
                break;
            case 17: {
                this.attributName = '住宅价格指标数据分析完整性';
                this.unit = '元/平方米';
                indexMonitor.districtSource = this.getDistrictSource(25469, 32, districtId);
            }
                break;
            case 18: {
                this.attributName = '非住宅用房指标数据分析完整性';
                this.unit = '元/平方米';
                indexMonitor.districtSource = this.getDistrictSource(25478, 32, districtId);
            }
                break;
            case 19: {
                this.attributName = '房价浮动';
                this.unit = '%';
                indexMonitor.districtSource = this.getDistrictSource(2, 1, districtId);
            }
                break;
            case 20: {
                this.attributName = '建筑面积供应量';
                this.unit = '万平方米';
                indexMonitor.districtSource = this.getDistrictSource(2324, 32, districtId);
                ;
            }
                break;
        }
        self.districtVector.setSource(self.districtSource);
    },
    //板块级别
    getSectionSource: function (i, plus, id) {
        var self = indexMonitor;
        var source = new ol.source.Vector({
            format: new ol.format.GeoJSON({
                featureProjection: 'EPSG:3857'
            }),
            loader: function (extent, resolution, projection) {
                indexMonitor.querySection(id, function (features) {
                    var countryPopVals = new Array();
                    var j = -1;
                    features.forEach(function (value) {
                        if(indexMonitor.attributName == '房价浮动'){
                            var number = value.N.objectid % 2;
                            if(number != 0){
                                j = j - plus;
                                i = j;
                            }else {
                                i = i + plus;
                            }
                        }else{
                        i = i + plus;}
                        var sale_count = i;
                        if (sale_count != null) {
                            countryPopVals.push(sale_count)
                            value.set('count', sale_count);
                        }
                    })
                    var serie = new geostats(countryPopVals);
                    serie.getClassEqInterval(6);
                    var colors_x = ['#1F9E54', '#68BF27', '#AEDB15', '#E0AF24', '#DE6021', '#E1230D'];
                    serie.setColors(colors_x);
                    var style = indexMonitor.getGradRenderStyle(serie, colors_x);
                    indexMonitor.sectionVector.setStyle(style);
                    document.getElementById('gisShow_2').innerHTML = serie.getHtmlLegend(colors_x, indexMonitor.attributName + '(' + indexMonitor.unit + ')', null,'','','',indexMonitor.attributName);
                    source.addFeatures(features);
                })
            }
        })
        return source;
    },
    querySection: function (cityId, callback) {
        var filter =
            'filter=' +
            '<And>' +
            '<PropertyIsEqualTo>' +
            '<PropertyName>city_code</PropertyName>' +
            '<Literal>' + cityId.substring(0, 4) + '</Literal>' +
            '</PropertyIsEqualTo>' +
            '<PropertyIsEqualTo>' +
            '<PropertyName>precinct_type</PropertyName>' +
            '<Literal>1</Literal>' +
            '</PropertyIsEqualTo>' +
            '</And>'
        var url = indexMonitor.serverUrl + 'service=WFS&version=1.0.0&request=GetFeature&typeName=eps:wh_precinct&'
            + filter +
            '&outputFormat=application%2Fjson'
        var ajax = new XMLHttpRequest();
        ajax.open('get', url, true);
        ajax.onreadystatechange = function (data) {
            if (ajax.readyState == 4 && ajax.status == 200) {
                var text = data.currentTarget.responseText;
                var json = eval('(' + text + ')');
                var features = new ol.format.GeoJSON().readFeatures(json);

                callback(features)
            }
        }
        ajax.send();
    },
    switchSectionSouce: function (value, id) {
        indexMonitor.lastValue = value;
        var districtId = ''
        if (id.length == 6) {
            districtId = id;
        } else {
            districtId = id + '00';
        }
        var self = indexMonitor;
        self.ifCommunity = false;
        switch (value) {
            case 1: {
                this.attributName = '押品数量';
                this.unit = '套';
                indexMonitor.sectionSource = this.getSectionSource(324, 32, districtId);
                this.lastData = '押品数量';
            }
                break;
            case 2: {
                this.attributName = '动态抵押率';
                this.unit = '%';
                indexMonitor.sectionSource = this.getSectionSource(1, 1, districtId);
                this.lastData = '动态抵押率';
            }
                break;
            case 3: {
                this.attributName = '住宅均价';
                this.unit = '元/平方米';
                indexMonitor.sectionSource = this.getSectionSource(23698, 32, districtId);
                this.lastData = '住宅均价';
            }
                break;
            case 4: {
                this.attributName = '非住宅均价';
                this.unit = '元/平方米';
                indexMonitor.sectionSource = this.getSectionSource(324, 32, districtId);
                this.lastData = '非住宅均价';
            }
                break;
            case 5: {
                this.attributName = '债偿收入比';
                this.unit = '%';
                indexMonitor.sectionSource = this.getSectionSource(1, 1, districtId);
                this.lastData = '债偿收入比';
            }
                break;
            case 6: {
                this.attributName = '经营性物业占比';
                this.unit = '%';
                indexMonitor.sectionSource = this.getSectionSource(2, 1, districtId);
                this.lastData = '经营性物业占比';
            }
                break;
            case 7: {
                this.attributName = '新楼盘指标分析';
                this.unit = '%';
                indexMonitor.sectionSource = this.getSectionSource(5, 1, districtId);
                this.lastData = '新楼盘指标分析';
            }
                break;
            case 8: {
                this.attributName = '楼盘';
                this.unit = '套';
                indexMonitor.sectionSource = this.getSectionSource(5800, 29, districtId);
                this.lastData = '楼盘';
            }
                break;
            case 9: {
                this.attributName = '住宅数量和比例';
                this.unit = '套';
                indexMonitor.sectionSource = this.getSectionSource(26585, 19, districtId);
                this.lastData = '住宅数量和比例';
            }
                break;
            case 10: {
                this.attributName = '住宅利率';
                this.unit = '%';
                indexMonitor.sectionSource = this.getSectionSource(2, 1, districtId);
                this.lastData = '住宅利率';
            }
                break;
            case 11: {
                this.attributName = '住宅面积';
                this.unit = '平方米';
                indexMonitor.sectionSource = this.getSectionSource(98, 1, districtId);
                this.lastData = '住宅面积';
            }
                break;
            case 12: {
                this.attributName = '住宅区域';
                this.unit = '';
                indexMonitor.sectionSource = this.getSectionSource(92, 1, districtId);
                this.lastData = '住宅区域';
            }
                break;
            case 13: {
                this.attributName = '房价浮动';
                this.unit = '%';
                indexMonitor.sectionSource = this.getSectionSource(3, 1, districtId);
                this.lastData = '房价浮动';
            }
                break;
            case 14: {
                this.attributName = '建筑面积供应量';
                this.unit = '';
                indexMonitor.sectionSource = this.getSectionSource(95, 1, districtId);
                this.lastData = '建筑面积供应量';
            }
                break;
            case 15: {
                this.attributName = '逾期分布';
                this.unit = '套';
                indexMonitor.sectionSource = this.getSectionSource(324, 2, districtId);
                this.lastData = '逾期分布';
            }
                break;
            case 16: {
                this.attributName = '存量楼盘数据分析完整性';
                this.unit = '%';
                indexMonitor.sectionSource = this.getSectionSource(1.2, 2, districtId);
                this.lastData = '存量楼盘数据分析完整性';
            }
                break;
            case 17: {
                this.attributName = '住宅价格指标数据分析完整性';
                this.unit = '元/平方米';
                indexMonitor.sectionSource = this.getSectionSource(25469, 32, districtId);
                this.lastData = '住宅价格指标数据分析完整性';
            }
                break;
            case 18: {
                this.attributName = '非住宅用房指标数据分析完整性';
                this.unit = '元/平方米';
                indexMonitor.sectionSource = this.getSectionSource(25478, 32, districtId);
                this.lastData = '非住宅用房指标数据分析完整性';
            }
                break;
            case 19: {
                this.attributName = '房价浮动';
                this.unit = '%';
                indexMonitor.sectionSource = this.getSectionSource(4, 1, districtId);
                this.lastData = '房价浮动';
            }
                break;
            case 20: {
                this.attributName = '建筑面积供应量';
                this.unit = '万平方米';
                indexMonitor.sectionSource = this.getSectionSource(2324, 32, districtId);
                this.lastData = '建筑面积供应量';
            }
                break;
        }
        self.sectionVector.setSource(self.sectionSource);
        self.sectionVector.setVisible(true);
    },
    //页面点击模块切换调用方法
    gisMapClick: function (number) {
        var zoom = indexMonitor.map.getView().getZoom();
        if (zoom >= 6 && zoom < 9) {
            indexMonitor.switchCitySource(number);
        } else if (zoom >= 9 && zoom < 11) {
            indexMonitor.switchDistrictSource(number, indexMonitor.cityId);
        } else if (zoom >= 11 && zoom < 13) {
            indexMonitor.switchSectionSouce(number, indexMonitor.cityId)
        }
    },
    //楼盘
    getRqVector: function (condition, type, type2) {
        var source = new ol.source.Vector({
            format: new ol.format.GeoJSON(),
            loader: function (extent) {
                // var filter =
                //     '&filter=' +
                //     '<PropertyIsEqualTo>' +
                //     '<PropertyName>city_code</PropertyName>' +
                //     '<Literal>' + indexMonitor.cityId + '</Literal>' +
                //     '</PropertyIsEqualTo>';
                // var url = indexMonitor.serverUrl + 'service=WFS&version=1.0.0&request=GetFeature&typeName=eps:wh_community_map'
                //     + filter + '&maxFeatures=10000&outputFormat=application%2Fjson';
                // var ajaxBuild = new XMLHttpRequest();
                // ajaxBuild.open('get', url, true);
                // ajaxBuild.onreadystatechange = function (data) {
                //     if (ajaxBuild.readyState == 4 && ajaxBuild.status == 200) {
                //         if (indexMonitor.rqVector.getVisible()) {
                //             source.forEachFeature(function (feat) {
                //                 source.removeFeature(feat)
                //             })
                //             var text = data.currentTarget.responseText;
                //             debugger
                //             var featureses = source.getFormat().readFeatures(text);
                //             source.addFeatures(featureses);
                //         }
                //     }
                // }
                // ajaxBuild.send();
                var filter = '&bbox=' + extent.join(',');
                var url = indexMonitor.serverUrl + 'service=WFS&version=1.0.0&request=GetFeature&typeName=eps:wh_community_map'
                    + filter + '&maxFeatures=5000&outputFormat=application%2Fjson';
                var ajaxBuild = new XMLHttpRequest();
                ajaxBuild.open('get', url, true);
                ajaxBuild.onreadystatechange = function (data) {
                    if (ajaxBuild.readyState == 4 && ajaxBuild.status == 200) {
                        if (indexMonitor.rqVector.getVisible()) {
                            source.forEachFeature(function (feat) {
                                source.removeFeature(feat)
                            })
                            var text = data.currentTarget.responseText;
                            var info = source.getFormat().readFeatures(text);
                            var featureArr = [];
                            if (condition != null || type != null) {
                                info.forEach(function (item) {
                                    if (type == '1000' && type2 != '2000' && item.N.house_type == type) {
                                        featureArr.push(item);
                                    } else if (type == '2000' && item.N.house_type.search('1000') && type2 != '2000') {
                                        featureArr.push(item);
                                    } else {
                                        featureArr.push(item);
                                    }
                                })
                            } else {
                                featureArr = info;
                            }
                            source.addFeatures(featureArr);
                        }
                    }
                }
                ajaxBuild.send();
            },
            strategy: ol.loadingstrategy.bbox
        })
        var vector = new ol.layer.Vector({
            source: source,
            zIndex: 1000
        });
        vector.setStyle(function (feat) {
            feat.setStyle(null);
            feat.setStyle(new ol.style.Style({
                image: new ol.style.Icon(({
                    src: '../../assets/newMap/housing.png'
                }))
            }));
            feat.set('type', 'rq');
        })
        vector.set('id', 'rq');
        vector.setVisible(false);
        return vector;
    },
    //模块切换事件
    displayChange: function (value, bool) {
        indexMonitor.map.getLayers().forEach(function (t) {
            if (t) {
                var id = t.get('id');
                if (id == value) {
                    if (bool == '1') {
                        if (t.getVisible()) {
                        } else {
                            t.setVisible(true);
                        }
                    } else if (bool == '2') {
                        t.setVisible(false);
                    }
                }
            }
        })
    },
    //查询点击事件
    searchClick: function (condition, type, type2) {
        var self = indexMonitor;
        self.map.getView().setZoom(15);
        self.map.getView().setCenter(self.ciewCenter);
        if (self.rqVector != null) {
            if (self.rqVector.setVisible()) {
                self.rqVector.getSource.forEachFeature(function (feat) {
                    self.rqVector.getSource.removeFeature(feat)
                })
            }
        }
        self.map.removeLayer(self.rqVector);
        if (condition != null || type != null) {
            self.rqVector = self.getRqVector(condition, type, type2);
        } else {
            self.rqVector = self.getRqVector();
        }
        self.arrLayers.push(self.rqVector);
        self.map.addLayer(self.rqVector);
        self.rqVector.setVisible(true);
    },
    //移动事件
    onMouseMove: function (e) {
        var selectFeatures = indexMonitor.getFeatureForPixel(e);
        indexMonitor.coordinate = e.coordinate;
        //获取视图中心点坐标
        var mapExtent = indexMonitor.map.getView().calculateExtent(indexMonitor.map.getSize());
        indexMonitor.ciewCenter = ol.extent.getCenter(mapExtent);
        if (selectFeatures.length == 0) {
            indexMonitor.length = 0;
            var ele = $('#rqInfo');
            if (ele) {
                ele.hide();
            }
            return
        } else {
            indexMonitor.length = selectFeatures.length;
            var feature = selectFeatures[0];
            var data = feature.N;
            if (data.count == null && data.type != 'rq') {
                var ele = $('#rqInfo');
                if (ele) {
                    ele.hide();
                }
                return;
            }
            var type = feature.getGeometry().getType();
            var center = e.coordinate;
            if (type == 'MultiPolygon' || type == 'Polygon' || type == 'Point') {
                if (indexMonitor.cityVector != null || indexMonitor.districtVector != null || indexMonitor.rqVector != null || indexMonitor.sectionVector != null) {
                    if (indexMonitor.cityVector.getVisible() || indexMonitor.districtVector.getVisible() || indexMonitor.sectionVector.getVisible()) {
                        var ele = $('#rqName');
                        if (ele.length == 0) {
                            indexMonitor.creatrPopup();
                            ele = $('#rqName');
                        }
                        $('#rqSj').css('border-top', '10px solid rgb(0,188,212)');
                        $('#rqName').css('border', '1px solid rgb(0,188,212)');
                        $('#rqName').css('top', '-37px');
                        var name = '';
                        if (typeof data.name === "undefined") {
                            name = data.label;
                        } else {
                            name = data.name;
                        }
                        ele.text(name + indexMonitor.attributName + ': ' + data.count + indexMonitor.unit);
                        ele.show();
                        $('#rqInfo').show();
                        indexMonitor.popup.setPosition(center);
                    } else if (type == 'Point') {
                        var ele = $('#rqName');
                        if (ele.length == 0) {
                            indexMonitor.creatrPopup();
                            ele = $('#rqName');
                        }
                        $('#rqSj').css('border-top', '10px solid rgb(0,188,212)');
                        $('#rqName').css('border', '1px solid rgb(0,188,212)');
                        $('#rqName').css('top', '-132px');
                        var html = '<p>住宅楼盘: ' + data.communityname + '</p><p>一手房价格: 68000元/平方米</p><p>一手房价格: 68000元/平方米</p><p>差价: 5000元/平方米</p>';
                        ele.html(html);
                        ele.show();
                        $('#rqInfo').show();
                        indexMonitor.popup.setPosition(center);
                    }
                }
            }
        }
    },
    //缩放事件
    onResChange: function (e) {
        var self = indexMonitor;
        var zoom = self.map.getView().getZoom();
        self.zoom = self.map.getView().getZoom();
        self.map.getLayers().forEach(function (t) {
            if (t) {
                var id = t.get('id');
                if (zoom >= 6 && zoom < 9) {
                    $('#gisShow_1').hide();
                    $('#gisShow_2').hide();
                    // $('#leftTable').hide();
                    if (id == 'city') {
                        // if(document.getElementById('map').style.display == 'none'){
                        //     $('#map').show();
                        // }
                        if (self.mBox == 'mBox' || self.attributName == null) {
                            self.switchCitySource(1);
                        }
                        self.mBox = 'openlayers';
                        self.hideTheOthers(id);
                        if (t.getVisible()) {

                        } else {
                            t.setVisible(true);
                        }
                        $('#gisShow').show();
                    }
                } else if (zoom >= 9 && zoom < 11) {
                    // $('#leftTable').hide();
                    $('#gisShow').hide();
                    $('#gisShow_2').hide();
                    if (id == 'district') {
                        self.hideTheOthers(id);
                        if (indexMonitor.mBox != 'mBox') {
                            var feature = indexMonitor.source.getFeaturesAtCoordinate(indexMonitor.coordinate);
                            if (feature.length != 0) {
                                if (self.lastFeatureId != feature[0].N.id) {
                                    self.lastFeatureId = feature[0].N.id;
                                    var value = self.lastValue == null ? 1 : self.lastValue;
                                    self.switchDistrictSource(value, feature[0].N.id);
                                }
                            }
                        }
                        // indexMonitor.mBox = 'openlayers';
                        t.setVisible(true);
                        $('#gisShow_1').show();
                    }
                } else if (zoom >= 11 && zoom < 13) {
                    $('#gisShow_1').hide();
                    $('#gisShow').hide();
                    self.districtVector.setVisible(false);
                    if (id == 'section') {
                        self.hideTheOthers(id);
                        var feature = indexMonitor.districtSource.getFeaturesAtCoordinate(indexMonitor.coordinate);
                        if (feature.length != 0 || indexMonitor.districtVector.getVisible()) {
                            var value = self.lastValue == null ? 1 : self.lastValue;
                            self.switchSectionSouce(value, feature[0].N.id);
                        }
                        if (t.getVisible()) {

                        } else {
                            t.setVisible(true);
                        }
                        $('#gisShow_2').show();
                    }
                } else if (zoom >= 13) {
                    $('#gisShow').hide();
                    $('#gisShow_2').hide();
                    $('#gisShow_2').hide();
                    self.sectionVector.setVisible(false);
                    self.hideTheOthers('rq');
                    // if (self.ifCommunity == true) {
                    if (self.rqVector == null) {
                        if (self.coordinate == null) {
                            self.coordinate = [12615328.043, 2648203.7431];
                            self.cityId = 440100;
                        }
                        var feature = indexMonitor.districtSource.getFeaturesAtCoordinate(indexMonitor.coordinate);
                        if (feature.length != 0) {
                            self.cityId = parseInt(feature[0].N.id);
                            // self.map.getView().setZoom(14);
                            self.rqVector = self.getRqVector();
                            self.arrLayers.push(self.rqVector);
                            self.map.addLayer(self.rqVector);
                            self.rqVector.setVisible(true);
                        }
                    } else if (id == 'rq') {
                        self.hideTheOthers(id);
                        if (t.getVisible()) {
                        } else {
                            t.setVisible(true);
                        }

                    }
                    // } else {
                    //     return;
                    // }
                }
            }
        })
    },
    //单击事件
    onSingleClick: function (e) {
        var self = indexMonitor;
        var selectFeatures = indexMonitor.getFeatureForPixel(e);
        if (selectFeatures.length == 0) {
            return
        } else {
            var feature = selectFeatures[0];
            var type = feature.getGeometry().getType();
            if (type == 'MultiPolygon' || type == 'Polygon') {
                try {
                    self.cityId = parseInt(feature.N.id.substring(0, 4));
                } catch (e) {
                }
                var zoom = self.map.getView().getZoom();
                var center = ol.extent.getCenter(feature.getGeometry().getExtent());
                if (zoom >= 6 && zoom < 9) {
                    self.map.getView().setCenter(center);
                    self.map.getView().setZoom(9);
                    self.cityVector.setVisible(false);
                    self.districtVector.setVisible(true);
                    var value = self.lastValue == null ? 1 : self.lastValue;
                    this.switchDistrictSource(value, self.cityId);
                }
                if (zoom >= 9 && zoom < 11) {
                    self.hideTheOthers('rq');
                    self.map.getView().setCenter(center);
                    self.map.getView().setZoom(11);
                    // self.switchSectionSouce(1,feature);
                }
                if (zoom >= 11 && zoom < 13) {
                    // if (this.ifCommunity == true) {
                    self.map.getView().setCenter(center);
                    self.map.getView().setZoom(14);
                    self.districtVector.setVisible(false);
                    this.rqVector = this.getRqVector();
                    this.arrLayers.push(this.rqVector);
                    this.map.addLayer(this.rqVector);
                    self.rqVector.setVisible(true);
                    // }
                }
            }
        }
    },
    //根据像素获取features
    getFeatureForPixel: function (e) {
        var features = new Array();
        var pixel = indexMonitor.map.getEventPixel(e.originalEvent);
        indexMonitor.map.forEachFeatureAtPixel(pixel, function (feature, layer) {
            features.push(feature)
        });
        return features;
    },
    //获取中心点
    getCenter: function (id) {
        var cityId = id.substring(0, 2);
        var center = null;
        var url = '../../assets/newMap/data/mapdata/city/' + cityId + '.json';
        $.ajax({
            url: url,
            type: 'GET',
            async: false,
            success: function (data) {
                data.features.forEach(function (item) {
                    if (id == (item.properties.id + '00')) {
                        center = ol.proj.transform(item.properties.cp, 'EPSG:4326', 'EPSG:3857');
                        return;
                    }
                });
                if (center == null) {
                    center = ol.proj.transform(data.cp, 'EPSG:4326', 'EPSG:3857');
                }
            }
        })
        return center;
    },
    referrerInit: function (inputData) {
        var city = inputData["city"];
        var district = inputData['district'];
        var communityId = inputData['communityId'];
        this.init();
        if (city == '' || city == null) {
            return;
        } else {
            if (district == null || district == '' || district == -1) {
                $("#city").val(city);
                $("#city").change();
            } else {
                if (communityId == null || communityId == '') {
                    $("#city").val(city);
                    this.getArea();
                    $("#district").val(district);
                    $("#district").change();
                } else {
                    this.inputData = this.getInputData('clusterMap');
                    this.inputData.city = city;
                    this.inputData.district = district;
                    this.inputData.communityId = communityId;
                    $.ajax({
                        url: '/map/mapCommunityData',
                        type: 'POST',
                        async: true,
                        data: this.inputData,
                        success: function (data) {
                            //根据url的数据创建此小区的feature
                            //在根绝feature创建小区详情
                            if (data.result.mapDataList == null) {
                                return;
                            }
                            var item = data.result.mapDataList[0];
                            var zoom = map.getView().getZoom();
                            var radius = 1e6 / Math.pow(2, zoom - 2.3);
                            var center = [item.lng, item.lat];
                            var text = xdmap.tool.strWrap(item.communityName.replace(/\s/g, ""), 3);
                            var feature = new ol.Feature({
                                id: item.communityId,
                                geometry: new ol.geom.Circle(center, radius),
                                text: text + '\n' + item.count + '笔'
                            });
                            feature.set('name', item.communityName.replace(/\s/g, ""), false);
                            feature.set('count', item.count, false);
                            feature.set('type', 'rq', false);
                            indexMonitor.clickFeature = feature;
                            indexMonitor.rqInfoName = item.communityName.replace(/\s/g, "");
                            indexMonitor.rqInfoCount = item.count;
                            indexMonitor.rqInfoCenter = center;
                            map.getView().setCenter(center);
                            map.getView().setZoom(18);
                        }
                    })
                }
            }
        }
    },
    //隐藏除id以外其他图层
    hideTheOthers: function (id) {
        this.arrLayers.forEach(function (value) {
            if (value) {
                if (value.get('id')) {
                    if (id != value.get('id')) {
                        value.setVisible(false);
                    }
                }
            }
        })
    },
    //获取渲染函数
    getGradRenderStyle: function (classSeries, classColors) {
        var style = function (feat, res) {
            var bounds = classSeries.bounds;
            var currVal = parseFloat(feat.get('count'));
            if (currVal == 0 || currVal == null || isNaN(currVal)) {
                currVal = bounds[0]
            }
            var numRanges = new Array();
            for (var i = 0; i < bounds.length - 1; i++) {
                numRanges.push({
                    min: parseFloat(bounds[i]),
                    max: parseFloat(bounds[i + 1])
                });
            }
            var classIndex = indexMonitor.verifyClassFromVal(numRanges, currVal);
            var polyStyleConfig = {
                stroke: new ol.style.Stroke({
                    color: 'rgba(255, 0, 0,0.8)',
                    width: 1
                })
            };
            var textStyleConfig = {};
            var label = feat.get('name');
            if (label == null) {
                label = feat.get('label');
            }
            if (classIndex !== -1) {
                polyStyleConfig = {
                    stroke: new ol.style.Stroke({
                        color: 'rgba(0, 0, 255, 0)',
                        width: 1
                    }),
                    fill: new ol.style.Fill({
                        color: indexMonitor.hexToRgbA(classColors[classIndex], 0.7)
                    })
                };
                textStyleConfig = {
                    text: new ol.style.Text({
                        text: label,
                        font: '12px Calibri,sans-serif',
                        fill: new ol.style.Fill({
                            color: "#000000"
                        }),
                        stroke: new ol.style.Stroke({
                            color: "#FFFFFF",
                            width: 2
                        })
                    }),
                    geometry: function (feature) {
                        var retPoint;
                        if (feature.getGeometry().getType() === 'MultiPolygon') {
                            retPoint = indexMonitor.getMaxPoly(feature.getGeometry().getPolygons()).getInteriorPoint();
                        } else if (feature.getGeometry().getType() === 'Polygon') {
                            retPoint = feature.getGeometry().getInteriorPoint();
                        }
                        return retPoint;
                    }
                }
            }
            var textStyle = new ol.style.Style(textStyleConfig);
            var style = new ol.style.Style(polyStyleConfig);
            return [style, textStyle];
        }
        return style;
    },
    verifyClassFromVal: function (rangevals, val) {
        var retIndex = -1;
        for (var i = 0; i < rangevals.length; i++) {
            if (val >= rangevals[i].min && val <= rangevals[i].max) {
                retIndex = i;
            }
        }
        return retIndex;
    },
    hexToRgbA: function (hex, opacity) {
        var c;
        if (/^#([A-Fa-f0-9]{3}){1,2}$/.test(hex)) {
            c = hex.substring(1).split('');
            if (c.length == 3) {
                c = [c[0], c[0], c[1], c[1], c[2], c[2]];
            }
            c = '0x' + c.join('');
            return 'rgba(' + [(c >> 16) & 255, (c >> 8) & 255, c & 255].join(',') + ',' + opacity + ')';
        }
        throw new Error('Bad Hex');
    },
    getMaxPoly: function (polys) {
        var polyObj = [];
        //now need to find which one is the greater and so label only this
        for (var b = 0; b < polys.length; b++) {
            polyObj.push({
                poly: polys[b],
                area: polys[b].getArea()
            });
        }
        polyObj.sort(function (a, b) {
            return a.area - b.area
        });

        return polyObj[polyObj.length - 1].poly;
    },
    removeOverlayByName: function (name) {
        var overlayers = map.getOverlays().a;
        for (var i = 0; i < overlayers.length; i++) {
            var overlay = overlayers[i];
            if (overlay) {
                if (overlay.get('name') != undefined) {
                    if (name == overlay.get('name')) {
                        map.removeOverlay(overlay);
                        i--;
                    }
                }
            }
        }
    },
}
var mbox = {
    map: null,
    baseMap: null,
    cityShadow: null,
    city3d: null,
    cityText: null,
    init: function () {
        var self = mbox;
        mapboxgl.accessToken = 'pk.eyJ1Ijoiam5leCIsImEiOiJjamw0a3UyejkwNTl5M3Bqb29oa3AxeTNyIn0.TkW5lUoMnYJW2xJoVGNk3g';
        var dataStyle = {
            "version": 8,
            "glyphs": "mapbox://fonts/mapbox/{fontstack}/{range}.pbf",
            "sources": {
                "bmap": {
                    "type": "raster",
                    "tiles": ["http://gissvc4an.cindata.cn/arcgis/rest/services/comm/ChinaGray/MapServer/export?F=image&FORMAT=PNG32&TRANSPARENT=true&SIZE=256%2C256&BBOX={bbox-epsg-3857}&BBOXSR=3857&IMAGESR=3857&DPI=90"],
                    "tileSize": 256
                }
            },
            "layers": []
        };
        // 底图
        self.baseMap = {
            "id": "baseMap",
            "type": "raster",
            'source': 'bmap',
            'source-layer': "ChinaGray"
        };
        //阴影
        self.cityShadow = {
            "id": "gd-sd",
            "type": 'fill',
            "source": {
                "type": "vector",
                "scheme": "tms",
                "tiles": ["http://geoserver.cindata.cn/geoserver/gwc/service/tms/1.0.0/cim:gr_city_gd@EPSG:900913@pbf/{z}/{x}/{y}.pbf"]
            },
            "source-layer": "gr_city_gd",
            "paint": {
                "fill-color": "#1A1817",
                "fill-translate": [1, 1],
                "fill-opacity": .8
            }
        };
        //广东省
        self.city3d = {
            "id": "gd",
            "type": 'fill-extrusion',
            "source": {
                "type": "vector",
                "scheme": "tms",
                "tiles": ["http://geoserver.cindata.cn/geoserver/gwc/service/tms/1.0.0/cim:gr_city_gd@EPSG:900913@pbf/{z}/{x}/{y}.pbf"]
            },
            "source-layer": "gr_city_gd",
            "paint": {
                "fill-extrusion-color": {
                    "type": "interval",
                    "property": "avg_price",
                    "stops": [
                        [4983, "#19984F"],
                        [5858, "#75CC31"],
                        [6079, "#C0ED21"],
                        [6641, "#EDED00"],
                        [6814, "#F8C739"],
                        [17396, "#FD7535"],
                        [56968, "#e82e21"]
                    ]
                },
                "fill-extrusion-height": {
                    "type": "exponential",
                    "stops": [
                        [7, 20000],
                        [9, 5000],
                        [10, 1500],
                        [13, 100],
                        [19, 10]
                    ]
                },
                "fill-extrusion-opacity": .85
            }
        };
        //注记
        self.cityText = {
            "id": "gd-label",
            "type": "symbol",
            "source": {
                "type": "vector",
                "scheme": "tms",
                "tiles": ["http://geoserver.cindata.cn/geoserver/gwc/service/tms/1.0.0/cim:gr_city_gd_text@EPSG:900913@pbf/{z}/{x}/{y}.pbf"]
            },
            "source-layer": "gr_city_gd_text",
            "layout": {
                "text-field": "{name}",
                "text-size": {
                    "type": "exponential",
                    "stops": [
                        [3, 14],
                        [10, 20]
                    ]
                },
                // "text-line-height":0.3,
                "text-offset": [0, -0.5]
            },
            "paint": {
                "text-color": "#fff",
                "text-halo-color": "#332a0d",
                "text-halo-width": 2
            }
        };

        self.map = new mapboxgl.Map({
            container: 'map',
            style: dataStyle,
            minZoom: 3,
            maxZoom: 19,
            zoom: 6,
            pitch: 20,
            attributionControl: false,
            center: [113.46, 22.31]
        });
        self.map.addControl(new mapboxgl.NavigationControl());

        self.map.on('load', function () {
            self.map.addLayer(self.baseMap);
            self.map.addLayer(self.cityShadow);
            self.map.addLayer(self.city3d);
            self.map.addLayer(self.cityText);
            self.map.setLight({color: "white", intensity: 0.8, position: [1.15, 244, 29]});
        });

        self.map.on('zoom', function () {
            var zoom = self.map.getZoom();
            if (zoom > 8) {
                $('#map').hide();
                indexMonitor.map.getView().setZoom(8);
                indexMonitor.switchCitySource(1)
            }
        })
    },
}
